<template>
    <div class="m-login">
        <div class="user-login">
            <ul v-if="!user">
                <li>
                    <img src="../../assets/images/avatar.jpg" class="avatar" alt="">
                </li>
                <li class="user-name">Hi！您好</li>
                <li>
                    <nuxt-link to="/register" class="btn">注册</nuxt-link>
                </li>
                <li>
                    <nuxt-link to="/login" class="btn">立即登录</nuxt-link>
                </li>
            </ul>
            <ul v-else>
                <li>
                    <img src="../../assets/images/avatar.jpg" class="avatar" alt="">
                </li>
                <li class="user-name">{{user}}</li>
                <li>
                    <div class="user-info clearfix">
                        <nuxt-link to="/order">
                            <p>
                                <i class="iconfont icon-order_iconx"></i>
                            </p>
                            <p class="fn-name">我的订单</p>
                        </nuxt-link>
                        <nuxt-link to="/">
                            <p>
                                <i class="iconfont icon-collection_iconx"></i>
                            </p>
                            <p class="fn-name">我的收藏</p>
                        </nuxt-link>
                        <nuxt-link to="/">
                            <p>
                                <i class="iconfont icon-more_iconx"></i>
                            </p>
                            <p class="fn-name">更多</p>
                        </nuxt-link>
                    </div>
                </li>
            </ul>
        </div>
        <div class="download-app">
            <ul>
                <li>
                    <img src="//s1.meituan.net/bs/fe-web-meituan/60ac9a0/img/download-qr.png" alt="下载APP">
                </li>
                <li>美团APP手机版</li>
                <li class="sz">
                    <span class="red">1元起</span>
                    吃喝玩乐
                </li>
            </ul>
        </div>
    </div>
</template>

<script>

export default{
    data(){
        return{
            user: ''
        }
    },
    async mounted(){
        let {status,data} = await this.$axios.get('http://127.0.0.1:8082/user/getUser');
        if(status === 200 && data.code === 0){
            this.user = data.username;
        }
    }         
}
</script>
